document.addEventListener('DOMContentLoaded', () => {
    // --- 导航栏滚动效果 --- //
    const navbar = document.querySelector('.navbar');
    // 移除滚动时改变背景色的逻辑，导航栏样式将完全由 CSS 控制。
    // window.addEventListener('scroll', () => {
    //     if (window.scrollY > 50) {
    //         navbar.style.backgroundColor = 'rgba(255, 255, 255, 0.95)';
    //         navbar.style.boxShadow = 'var(--shadow)';
    //     } else {
    //         navbar.style.backgroundColor = 'rgba(255, 255, 255, 0.8)';
    //         navbar.style.boxShadow = 'none';
    //     }
    // });

    // --- 照片轮播器功能 --- //
    const slides = document.querySelectorAll('.carousel-slide');
    const dotsContainer = document.querySelector('.carousel-dots');
    const prevBtn = document.querySelector('.carousel-prev');
    const nextBtn = document.querySelector('.carousel-next');
    let currentSlide = 0;

    // 创建指示点
    slides.forEach((_, index) => {
        const dot = document.createElement('span');
        dot.classList.add('dot');
        if (index === 0) dot.classList.add('active');
        dot.addEventListener('click', () => goToSlide(index));
        dotsContainer.appendChild(dot);
    });
    const dots = document.querySelectorAll('.carousel-dots .dot');

    function showSlide(index) {
        slides.forEach((slide, i) => {
            slide.style.display = (i === index) ? 'block' : 'none';
        });
        dots.forEach((dot, i) => {
            dot.classList.toggle('active', i === index);
        });
    }

    function goToSlide(index) {
        currentSlide = (index + slides.length) % slides.length;
        showSlide(currentSlide);
    }

    function nextSlide() {
        goToSlide(currentSlide + 1);
    }

    function prevSlide() {
        goToSlide(currentSlide - 1);
    }

    nextBtn.addEventListener('click', nextSlide);
    prevBtn.addEventListener('click', prevSlide);

    // 自动轮播
    let slideInterval = setInterval(nextSlide, 5000);

    // 鼠标悬停时暂停自动轮播
    const carouselContainer = document.querySelector('.carousel-container');
    carouselContainer.addEventListener('mouseenter', () => clearInterval(slideInterval));
    carouselContainer.addEventListener('mouseleave', () => slideInterval = setInterval(nextSlide, 5000));

    showSlide(currentSlide); // 初始化显示第一张

    // --- AI 助手模态框功能 --- //
    const aiChatModal = document.getElementById('ai-chat-modal');
    // const openAiChatBtn = document.getElementById('open-ai-chat-btn'); // 旧的按钮已移除
    const openAiFloatBtn = document.getElementById('open-ai-float-btn'); // 新的悬浮按钮
    const closeAiChatBtn = aiChatModal.querySelector('.close-btn');
    const chatArea = aiChatModal.querySelector('.chat-area');
    const userInput = document.getElementById('user-input');
    const sendMsgBtn = document.getElementById('send-msg-btn');
    const clearChatBtn = document.getElementById('clear-chat-btn');
    const exportChatBtn = document.getElementById('export-chat-btn');

    // 打开模态框 (通过悬浮按钮)
    openAiFloatBtn.addEventListener('click', () => {
        aiChatModal.style.display = 'flex'; // 确保模态框容器可见以便动画开始
        // 添加一个短暂的延迟，确保浏览器有时间渲染 display: flex，再开始动画
        setTimeout(() => {
            aiChatModal.classList.add('active');
            document.body.style.overflow = 'hidden'; // 防止背景滚动
        }, 10);
    });

    // 关闭模态框
    closeAiChatBtn.addEventListener('click', () => {
        // 移除 active 类，触发缩小动画
        aiChatModal.classList.remove('active');
        // 使用 setTimeout 确保在动画结束后隐藏模态框并恢复滚动
        setTimeout(() => {
            aiChatModal.style.display = 'none'; // 动画结束后才隐藏
            document.body.style.overflow = ''; // 恢复背景滚动
        }, 350); // 确保时间略长于 CSS transition 的持续时间 (0.3s = 300ms)
    });

    // 点击模态框外部关闭
    window.addEventListener('click', (event) => {
        if (event.target === aiChatModal) {
            // 移除 active 类，触发缩小动画
            aiChatModal.classList.remove('active');
            // 使用 setTimeout 确保在动画结束后隐藏模态框并恢复滚动
            setTimeout(() => {
                aiChatModal.style.display = 'none'; // 动画结束后才隐藏
                document.body.style.overflow = ''; // 恢复背景滚动
            }, 350); // 确保时间略长于 CSS transition 的持续时间 (0.3s = 300ms)
        }
    });

    // 发送消息函数
    async function sendMessage() {
        const messageText = userInput.value.trim();
        if (messageText === '') return;

        appendMessage('user', messageText);
        userInput.value = '';
        scrollToBottom();

        // 显示加载动画
        const loadingMessage = appendMessage('ai', '', true); // 添加一个空的AI消息用于加载动画
        const loadingTextElement = loadingMessage.querySelector('p');
        loadingTextElement.innerHTML = '<i class="fas fa-spinner fa-spin"></i> 思考中...';
        scrollToBottom();

        try {
            // 模拟 AI 回复
            // 实际应用中这里会是 API 调用
            const response = await simulateAIChat(messageText);
            // 移除加载动画，显示真实回复
            loadingTextElement.innerHTML = ''; // 清空加载动画文本
            typeWriterEffect(loadingTextElement, response, () => {
                scrollToBottom();
            });
        } catch (error) {
            console.error('AI Chat Error:', error);
            loadingTextElement.innerHTML = '抱歉，AI 助手出现错误。';
            scrollToBottom();
        }
    }

    // 模拟 AI 聊天回复 (实际应用中替换为后端 API 调用)
    async function simulateAIChat(userMessage) {
        // 直接在前端硬编码 API 密钥存在安全风险，生产环境请务必使用后端代理。
        const OPENROUTER_API_KEY = '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';
        const OPENROUTER_BASE_URL = 'https://openrouter.ai/api/v1';

        try {
            // 移除模拟网络延迟
            // await new Promise(resolve => setTimeout(resolve, 1000 + Math.random() * 1000));

            const response = await fetch(`${OPENROUTER_BASE_URL}/chat/completions`, {
                method: 'POST',
                headers: {
                    'Authorization': `Bearer ${OPENROUTER_API_KEY}`,
                    'Content-Type': 'application/json'
                },
                body: JSON.stringify({
                    'model': 'deepseek/deepseek-chat-v3.1:free', // 已更新为 DeepSeek V3.1 (free)
                    'messages': [{ 'role': 'user', 'content': userMessage }],
                    'stream': false // 暂时禁用流式传输以简化处理
                })
            });

            if (!response.ok) {
                const errorData = await response.json();
                throw new Error(`API error: ${response.status} - ${errorData.message || response.statusText}`);
            }

            const data = await response.json();
            return data.choices[0].message.content;

        } catch (error) {
            console.error('Error calling OpenRouter API:', error);
            return '抱歉，连接 AI 助手时出现问题。请稍后再试或检查网络。';
        }
    }

    // 添加消息到聊天区
    function appendMessage(sender, text, isLoading = false) {
        const messageElement = document.createElement('div');
        messageElement.classList.add('chat-message', sender);
        const pElement = document.createElement('p');
        if (!isLoading) pElement.textContent = text;
        messageElement.appendChild(pElement);
        chatArea.appendChild(messageElement);
        scrollToBottom();
        return messageElement; // 返回消息元素以便后续修改（如打字机效果或加载动画）
    }

    // 打字机效果
    function typeWriterEffect(element, text, callback) {
        let i = 0;
        element.textContent = ''; // 清空内容
        function type() {
            if (i < text.length) {
                element.textContent += text.charAt(i);
                i++;
                chatArea.scrollTop = chatArea.scrollHeight; // 每次打字时滚动到底部
                setTimeout(type, 15); // 加快打字速度 (从30ms减少到15ms)
            } else if (callback) {
                callback();
            }
        }
        type();
    }

    // 滚动到底部
    function scrollToBottom() {
        chatArea.scrollTop = chatArea.scrollHeight;
    }

    // 监听输入框回车键
    userInput.addEventListener('keypress', (event) => {
        if (event.key === 'Enter') {
            event.preventDefault(); // 阻止默认回车行为（如换行）
            sendMessage();
        }
    });
    sendMsgBtn.addEventListener('click', sendMessage);

    // 清空对话历史
    clearChatBtn.addEventListener('click', () => {
        chatArea.innerHTML = '<div class="chat-message ai"><p>你好！我是您的 AI 助手，有什么可以帮助您的吗？</p></div>';
        scrollToBottom();
    });

    // 导出对话记录
    exportChatBtn.addEventListener('click', () => {
        let chatHistory = '';
        chatArea.querySelectorAll('.chat-message').forEach(messageElement => {
            const sender = messageElement.classList.contains('user') ? '用户' : 'AI';
            const text = messageElement.querySelector('p').textContent;
            chatHistory += `${sender}: ${text}\n\n`;
        });

        const blob = new Blob([chatHistory], { type: 'text/plain;charset=utf-8' });
        const a = document.createElement('a');
        a.href = URL.createObjectURL(blob);
        a.download = 'ai_chat_history.txt';
        document.body.appendChild(a);
        a.click();
        document.body.removeChild(a);
        URL.revokeObjectURL(a.href); // 释放URL对象
        alert('对话记录已导出为 ai_chat_history.txt');
    });

    // --- 返回顶部按钮 --- //
    const backToTopButton = document.getElementById('back-to-top');

    window.addEventListener('scroll', () => {
        if (window.scrollY > 300) {
            backToTopButton.style.display = 'flex';
        } else {
            backToTopButton.style.display = 'none';
        }
    });

    backToTopButton.addEventListener('click', () => {
        window.scrollTo({ top: 0, behavior: 'smooth' });
    });

    // --- 滚动时的渐入动画 --- //
    const sections = document.querySelectorAll('section');

    const observer = new IntersectionObserver((entries) => {
        entries.forEach(entry => {
            if (entry.isIntersecting) {
                entry.target.classList.add('visible');
            } else {
                // 可选：如果希望离开视口后重新隐藏，则取消注释以下行
                // entry.target.classList.remove('visible');
            }
        });
    }, {
        threshold: 0.1 // 当元素10%可见时触发
    });

    sections.forEach(section => {
        observer.observe(section);
    });
});
